<style type="text/css">
    #hr-scoreMapping-detail, #hr-scoreMapping-detail .scoreMapping-info {
        display: inline-block;
        float: left;
        margin-left: 15px;
    }

    #hr-scoreMapping-detail #scoreMapping-info-wrapper {
        margin: 0 0 1rem 0;
        display: inline-block;
    }

    #hr-scoreMapping-detail .scoreMapping-info div {
        margin: 10px 15px;
        max-width: 19rem;
    }
</style>

<!-- 注意id属性每个页面id必须独立 lay-title为当前页面的标题属性-->
<div class="layui-fluid" id="hr-scoreMapping-detail" lay-title="积分规则信息">
    <div id="scoreMapping-info-wrapper">
        <div class="scoreMapping-info">
            <!-- scoreMapping为后台返回的对象-->
            <div><span class="layui-icon layui-icon-form"></span> 积分类型：
                [[${scoreMapping.type}]]
            </div>
            <!-- 使用strings.defaultString 判断是否为空-->
            <div><span class="layui-icon layui-icon-read"></span> 备注：
                [[${#strings.defaultString(scoreMapping.remark, '暂无备注')}]]
            </div>
        </div>

        <div class="scoreMapping-info">
            <div><span class="layui-icon layui-icon-user"></span> 最大值：
                [[${scoreMapping.maxValue}]]
            </div>
            <div><span class="layui-icon layui-icon-user"></span> 最小值：
                [[${scoreMapping.minValue}]]
            </div>
            <div><span class="layui-icon layui-icon-user"></span> 积分值：
                [[${scoreMapping.integralValue}]]
            </div>
            <div><span class="layui-icon layui-icon-user"></span> 创建人：
                [[${scoreMapping.userName}]]
            </div>
            <div><span class="layui-icon layui-icon-time-circle"></span> 创建时间：
                [[${#strings.defaultString(createDate, '未显示时间')}]]
            </div>
            <div><span class="layui-icon layui-icon-user"></span> 最近更新人：
                [[${scoreMapping.updateUserName}]]
            </div>
            <div><span class="layui-icon layui-icon-time-circle"></span> 最近更新时间：
                [[${#strings.defaultString(lastModifyDate, '未显示时间')}]]
            </div>
        </div>
    </div>
</div>